﻿(function (exports) {

    'use strict';

    var filters = {
        all: function (todos) {
            return todos;
        },
        active: function (todos) {
            return todos.filter(function (todo) {
                return !todo.completed;
            });
        },
        completed: function (todos) {
            return todos.filter(function (todo) {
                return todo.completed;
            });
        }
    };

    exports.app = new Vue({

        el: '#app',
        data: {
            todolist:todoStorage.fetch(),
            newItem: '',
            editedTodo: null,
            visibility: 'all'
        },
        computed: {
            filteredTodos: function () {
                return filters[this.visibility](this.todolist);
            },
            allCount: function () {
                return this.todolist.length;
            },
            activeCount: function () {
                return filters.active(this.todolist).length;
            },
            completedCount: function () {
                return filters.completed(this.todolist).length;
            }
        },
        methods: {
            changeState: function (param) {
                param.finished = !param.finished;
            },
            addNew: function () {
                var newOne = {
                    label: this.newItem,
                    finished: false
                }
                this.todolist.unshift(newOne);
                this.newItem = '';
            },
            editTodo: function (param) {
                this.beforeEditCache = param.label;
                this.editedTodo = param;
            },
            editItem: function (param) {
                if (!this.editedTodo)
                    return;
                if (!param.label) {
                    this.todolist.$remove(param);
                }
                this.editedTodo = null;
            },
            cancelEdit: function (param) {
                param.label = this.beforeEditCache;
                this.editedTodo = null;
            },
            delItem: function (param) {
                if (confirm("确认删除吗？")) {
                    this.todolist.$remove(param);
                }
            },
            delCompletedItem: function () {
                if (confirm("确认删除所有已完成任务吗？")) {
                    this.todolist = filters.active(this.todolist);                      
                }
            }
        },
        watch: {
            'todolist': {
                deep: true,
                handler: function (val, oldVal) {
                    var temp = JSON.stringify(val);                    
                    todoStorage.save(temp)
                      
                    this.$http.post("/todo/Save", { body: "" }, { params: { uid: "1", todolist: temp } }).then(function (response) {
                        console.log("success===>" + response.body);
                        // success callback
                    }, function (response) {
                        // error callback
                        console.log("error===>" + JSON.stringify(response));
                    });            
                }
            }
        }
    });

})(window);